<template>
	<view v-if="stateVal">
		<view class="check-state-text" :style="{'color': '#fff', 'background': stateColor}">{{stateText}}</view>
	</view>
</template>

<script>
	export default {
		name:"check-state",
		props: {
			// 传入的状态值
			stakey: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				// 订单状态数组
				statusArr: [
					{
						text: '未审核', 
						val: '未审核', 
						color: '#ff7300'
					},
					{ 
						text: '已审核', 
						val: '已审核',
						color: '#008000'
					},
					{
						text: '已报销', 
						val: '已报销', 
						color: '#00c3ce'
					},
					{
						text: '已拒绝', 
						val: '已拒绝',
						color: '#f00000'
					}
				],
				
				// 当前状态值
				stateVal: '',
				// 当前状态描述
				stateText: '',
				// 当前状态颜色
				stateColor: '',
			};
		},
		mounted() {
			const that = this;
			// console.log('传入的值', that.stakey);
			let obj = that.statusArr.find(it => it.val == that.stakey);
			if(obj){
				that.stateVal = obj.val;
				that.stateText = obj.text;
				that.stateColor = obj.color;
			}
		},
		
	}
</script>

<style lang="less">
.check-state-text{
	display: inline-block;
	padding: 0rpx 10rpx;
	margin-right: 10rpx;
	border-radius: 4rpx;
}
</style>
